---
import {parseTitle} from '@/util'

export interface Props {
  post: any;
}

const { post } = Astro.props;
const title = parseTitle(post.url);
const { pic, desc, date } = post.frontmatter;
---

<a
  href={post.url}
  class="art-card pb-3 md:mt-5 mt-4 md:mr-5 flex flex-col justify-center rounded-b-md shadow-md overflow-hidden mx-auto md:w-80 w-96"
>
  <img

    data-src={`${pic? (pic.indexOf('t-qiniu') > -1 ?  pic+'?imageView2/2/w/640' : pic ) :'https://dummyimage.com/600x400/fff/000000.jpg&text=Hello'}`}
    data-alt={title}
    alt={title}
    class="img lozad block md:w-80 md:h-48 w-96 h-52 rounded-t-md"
  />
  <div
    class="w-full flex justify-between items-center leading-tight pt-4 pl-3 pr-3"
  >
    <div class="text-800 seLine1">{title}</div>
    <div class="text-grey-darker text-sm text-600">{date}</div>
  </div>
  <p
    class="card-desc text-sm md:w-78 w-94 overflow-hidden pt-2.5 line-clamp-2 px-3 w-full h-12"
  >
    {desc}
  </p>
</a>